<style lang="less">
  .item1{
    height: 42px;
    line-height: 40px;
  }
  .row-left{
    text-align: center;
  }
  .title-top{
    margin-bottom:10px;
    color: #1C86EE;
    font-size: 1rem;
    border-bottom: 1px solid orangered;
    font-size: 20px;
    color: coral;
  }
  .navi-title {
    height:30px;
    background-color:#f8f8f9;
    line-height:30px;
    padding-left: 15px;
    color: #5CACEE;
    font-size: 0.7rem;
    font-weight: bold;
  }
  .content{
    background-color:white;
    height: auto;
    border: 1px solid lightgray;
    padding: 0px;
  }
  .idCard{
    width: 170px;
    height: 80px;
    background-color: #79e428;
    position: absolute;
    right: 2%;
    top: 13%;
    color: white;
    font-size: 1.5rem;
    line-height: 80px;
    text-align: center;
  }
  .red-name{
    color: red
  }
  .ivu-steps-item {
    display: initial;
    position: relative;
    vertical-align: initial;
  }
  .step-item {
    float: left;
    margin-left: 0px;
  }
</style>
<template>
  <div style="background-color:white">
    <div style="">
      <Row class="title-top">
        <Col span="4" style="text-align: left;width:22%">特困人员身份确认申请登记</Col>
      </Row>
    </div>
    <div style="height:30px;">
      <Steps :current="5" style="margin-bottom:10px" size="small">
        <div @click="nextStep('0')" class="step-item">
          <Step title="申请人基本信息" content=""></Step>
        </div>
        <div @click="nextStep('1')" class="step-item">
          <Step title="申请人详细信息" content=""></Step>
        </div>
        <div @click="nextStep('2')" class="step-item">
          <Step title="基础收入" content=""></Step>
        </div>
        <div @click="nextStep('3')" class="step-item">
          <Step title="赡（抚、扶）养" content=""></Step>
        </div>
        <div @click="nextStep('4')" class="step-item">
          <Step title="基础财产" content=""></Step>
        </div>
        <div @click="nextStep('5')" class="step-item">
          <Step title="财产-房产" content=""></Step>
        </div>
        <div @click="nextStep('6')" class="step-item">
          <Step title="办理要件" content=""></Step>
        </div>
        <div @click="nextStep('7')" class="step-item">
          <Step title="申请受理" content=""></Step>
        </div>
      </Steps>
    </div>
    <div class="content">
      <div class="navi-title">
        财产房产信息
      </div>
      <div style="height:30px;margin-top:3px">
        <Button type="info" class="step-item" style="margin-left:5px" size="small" @click="entry()">录入</Button>
        <Modal v-model="modal" title="录入财产-房产" width="900" style="position:relative;">
          <Form ref="paramData" :model="paramData">
            <Row class="item1">
              <Col span="5" style="text-align: center" class="red-name">人员姓名:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0001">
                  <Option :value="obj.ss11002Id" v-for="obj in dataF1" v-bind:key="obj.ss11002Id">{{obj.azcp0003}}</Option>
                </Select>
              </Col>
              <Col span="5" style="text-align: center" class="">房产证编号:</Col>
              <Col span="6">
                <Input v-model="paramData.ssbe0002" placeholder=""></Input>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="">房屋坐落地址:</Col>
              <Col span="6">
                <Input v-model="paramData.ssbe0003" placeholder=""></Input>
              </Col>
              <Col span="5" style="text-align: center" class="">是否实际居住房产:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0004">
                  <Option :value="obj.key" v-for="obj in data2.YesOrNoDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="red-name">住房情况:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0005">
                  <Option :value="obj.key" v-for="obj in data2.HouseNatureDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
              <Col span="5" style="text-align: center" class="">住房情况详细分类:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0006">
                  <Option :value="obj.key" v-for="obj in data2.HouseNature_childDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="red-name">房屋类型:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0007">
                  <Option :value="obj.key" v-for="obj in data2.HouseTypeDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
              <Col span="5" style="text-align: center" class="red-name">房屋建筑面积:</Col>
              <Col span="6">
                <Input v-model="paramData.ssbe0008" placeholder=""></Input>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="red-name">房产性质:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0009">
                  <Option :value="obj.key" v-for="obj in data2.HousePropertyDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
              <Col span="5" style="text-align: center" class="red-name">房屋状况:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0010">
                  <Option :value="obj.key" v-for="obj in data2.HouseConditionDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="">房产证发证时间:</Col>
              <Col span="6">
                <DatePicker type="date" v-model="paramData.ssbe0011" placeholder="Select date" style="width: 217px"></DatePicker>
              </Col>
              <Col span="5" style="text-align: center" class="">房屋间数:</Col>
              <Col span="6">
                <Input v-model="paramData.ssbe0012" placeholder=""></Input>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="red-name">取暖形式:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0013">
                  <Option :value="obj.key" v-for="obj in data2.WarmTypeDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
              <Col span="5" style="text-align: center" class="">供暖公司:</Col>
              <Col span="6">
                <Input v-model="paramData.ssbe0014" placeholder=""></Input>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="">是否农村住房:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0015">
                  <Option :value="obj.key" v-for="obj in data2.YesOrNoDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
              <Col span="5" style="text-align: center" class="">是否申请危房鉴定:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0016">
                  <Option :value="obj.key" v-for="obj in data2.YesOrNoDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="">鉴定结论:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0017">
                  <Option :value="obj.key" v-for="obj in data2.AppraisalConclusionDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
              <Col span="5" style="text-align: center" class="red-name">住房结构:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0018">
                  <Option :value="obj.key" v-for="obj in data2.HouseStructureDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
            </Row>
            <Row class="item1">
              <Col span="5" style="text-align: center" class="">是否享受购建房补助:</Col>
              <Col span="6">
                <Select v-model="paramData.ssbe0019">
                  <Option :value="obj.key" v-for="obj in data2.YesOrNoDict" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
              <Col span="5" style="text-align: center" class="">房屋估值:</Col>
              <Col span="6">
                <Input v-model="paramData.ssbe0020" placeholder=""></Input>
              </Col>
            </Row>
          </Form>
          <div slot="footer">
            <Button type="text" size="large" @click="modal = false">取消</Button>
            <Button type="primary" size="large" @click="ok111(paramData)">确定</Button>
          </div>
        </Modal>
        <!-- <Button type="info" class="step-itemoption" style="margin-left:5px">查看</Button> -->
      </div>
      <div>
        <Table :columns="columns1" :data="data3"></Table>
        <div style="margin: 10px;overflow: hidden">
        <div style="float: right;">
            <Page :total="data3.length" :current="1" @on-change="changePage"></Page>
        </div>
    </div>
      </div>
    </div>
    <div style="height:40px;line-height:40px;float:left;margin-top:10px;margin-left:40%">
      <Button type="info" @click="next()">下一步></Button>
    </div>
  </div>
</template>
<script>
import { getTKAppraising, iteminf, updateOrder, date2str } from '@/api/eventlist'
export default {
  data () {
    return {
      family_url: '',
      support_id: '',
      family_idInfo: {},
      next_params: {},
      itemid: this.$route.params.itemid || '',
      house_url: '',
      info_url: '',
      add_url: '',
      update_url: '',
      delete_url: '',
      see: this.$route.params.see || false,
      code: this.$route.params.code,
      url: 'dbsq/addHouseInfo',
      str: this.$route.params.serialNumber,
      idcardNumber: this.$route.params.idcardNumber,
      ss11001Id: this.$route.params.ss11001Id,
      ss11002Id: this.$route.params.ss11002Id,
      errorTitle: '保存错误',
      columns1: [
        {
          title: '人员姓名',
          key: 'ssbe0001',
          width: '85px'
        },
        {
          title: '是否实际居住房产',
          key: 'ssbe0004',
          width: '140px'
        },
        {
          title: '住房情况 ',
          key: 'ssbe0005',
          width: '85px'
        },
        {
          title: '住房情况详细分类',
          key: 'ssbe0006',
          width: '140px'
        },
        {
          title: '房屋类型',
          key: 'ssbe0007',
          width: '85px'
        },
        {
          title: '房产性质',
          key: 'ssbe0009',
          width: '85px'
        },
        {
          title: '房屋状况',
          key: 'ssbe0010',
          width: '85px'
        },
        {
          title: '取暖形式',
          key: 'ssbe0013',
          width: '85px'
        },
        {
          title: '是否享受购建房补助',
          key: 'ssbe0019',
          width: '160px'
        },
        {
          title: '操作',
          key: 'cardno',
          render: (h, params) => {
            return h('div', [
              h('Button', {
                props: {
                  type: 'primary',
                  size: 'small'
                },
                style: {
                  marginRight: '5px'
                },
                on: {
                  click: () => {
                    this.edit(params.index)
                  }
                }
              }, '编辑'),
              h('Button', {
                props: {
                  type: 'error',
                  size: 'small'
                },
                on: {
                  click: () => {
                    this.deletePeople(params.index)
                  }
                }
              }, '删除')
            ])
          }
        }
      ],
      paramData: {
        ssbe0001: '',
        ssbe0002: '',
        ssbe0003: '',
        ssbe0004: '',
        ssbe0005: '',
        ssbe0006: '',
        ssbe0007: '',
        ssbe0008: '',
        ssbe0009: '',
        ssbe0010: '',
        ssbe0011: '',
        ssbe0012: '',
        ssbe0013: '',
        ssbe0014: '',
        ssbe0015: '',
        ssbe0016: '',
        ssbe0017: '',
        ssbe0018: '',
        ssbe0019: '',
        ssbe0020: ''
      },
      data1: [],
      data2: [],
      data3: [],
      dataF1: [],
      modal: false,
      form_params: {
        ss11001Data: {},
        ss11002Data: {},
        ss11003Data: [],
        ss11005Data: [],
        ss11006Data: [],
        ss11007Data: [],
        ss11010Data: [],
        ss12002Data: {}
      },
      receive_arr: [],
      id: ''
    }
  },
  methods: {
    nextStep (step) {
      if (step === '0') {
        this.$router.push({
          name: 'tk_subsistenceapplication',
          params: this.next_params
        })
      } else if (step === '1') {
        this.$router.push({
          name: 'tk_subsistenceapplication1',
          params: this.next_params
        })
      } else if (step === '2') {
        this.$router.push({
          name: 'tk_subsistenceapplication2',
          params: this.next_params
        })
      } else if (step === '3') {
        this.$router.push({
          name: 'tk_supportlist',
          params: this.next_params
        })
      } else if (step === '4') {
        this.$router.push({
          name: 'tk_basicproperty',
          params: this.next_params
        })
      } else if (step === '6') {
        this.$router.push({
          name: 'tk_nearfamily',
          params: this.next_params
        })
      } else if (step === '7') {
        const content = '<p>请先上传要件</p>'
        this.$Modal.error({
          title: this.errorTitle,
          content: content
        })
      }
    },
    getInfo (index, ssbe0004, ssbe0005, ssbe0006, ssbe0007, ssbe0009, ssbe0010, ssbe0013, ssbe0019) {
      var param = {
        'idcardNumber': this.idcardNumber,
        'dictsCode': 'ss11007',
        'serialNumber': this.str
      }
      getTKAppraising(param).then(res => {
        this.data2 = res.data.data.data
        for (var i in this.data2.YesOrNoDict) {
          if (this.data2.YesOrNoDict[i].key === ssbe0004) {
            this.data3[index].ssbe0004 = this.data2.YesOrNoDict[i].value
          }
          if (this.data2.YesOrNoDict[i].key === ssbe0019) {
            this.data3[index].ssbe0019 = this.data2.YesOrNoDict[i].value
          }
        }
        for (var j in this.data2.HouseNatureDict) {
          if (this.data2.HouseNatureDict[j].key === ssbe0005) {
            this.data3[index].ssbe0005 = this.data2.HouseNatureDict[j].value
          }
        }
        for (var k in this.data2.HouseNature_childDict) {
          if (this.data2.HouseNature_childDict[k].key === ssbe0006) {
            this.data3[index].ssbe0006 = this.data2.HouseNature_childDict[k].value
          }
        }
        for (var m in this.data2.HouseTypeDict) {
          if (this.data2.HouseTypeDict[m].key === ssbe0007) {
            this.data3[index].ssbe0007 = this.data2.HouseTypeDict[m].value
          }
        }
        for (var n in this.data2.HousePropertyDict) {
          if (this.data2.HousePropertyDict[n].key === ssbe0009) {
            this.data3[index].ssbe0009 = this.data2.HousePropertyDict[n].value
          }
        }
        for (var p in this.data2.HouseConditionDict) {
          if (this.data2.HouseConditionDict[p].key === ssbe0010) {
            this.data3[index].ssbe0010 = this.data2.HouseConditionDict[p].value
          }
        }
        for (var q in this.data2.WarmTypeDict) {
          if (this.data2.WarmTypeDict[q].key === ssbe0013) {
            this.data3[index].ssbe0013 = this.data2.WarmTypeDict[q].value
          }
        }
        for (var r in this.data2.WarmTypeDict) {
          if (this.data2.WarmTypeDict[r].key === ssbe0013) {
            this.data3[index].ssbe0013 = this.data2.WarmTypeDict[r].value
          }
        }
      })
    },
    ok111 (item1) {
      var param = {}
      this.paramData.ssbe0011 = date2str(this.paramData.ssbe0011)
      this.paramData.ss11007Id = this.$route.params.uuid
      if (this.id !== '') { // 编辑
        this.receive_arr[this.id] = this.paramData
        this.data3 = JSON.parse(JSON.stringify(this.receive_arr))
        this.form_params.ss11007Data = this.receive_arr
        param = {
          item_id: this.$route.params.itemid,
          cardno: this.$route.params.cardno,
          form_params: this.form_params,
          code: this.$route.params.code
        }
      } else {
        this.receive_arr.push(this.paramData)
        this.data3 = JSON.parse(JSON.stringify(this.receive_arr))
        this.form_params.ss11007Data = this.receive_arr
        param = {
          item_id: this.$route.params.itemid,
          cardno: this.$route.params.cardno,
          form_params: this.form_params,
          code: this.$route.params.code
        }
      }
      updateOrder(param).then(res => {
        if (res.data.errcode === 0) {
          this.$Message.success(res.data.errmsg)
          for (var i = 0; i < this.data3.length; i++) {
            this.data3[i].ssbe0001 = this.dataF1[0].azcp0003
            this.getInfo(i, this.data3[i].ssbe0004, this.data3[i].ssbe0005, this.data3[i].ssbe0006, this.data3[i].ssbe0007, this.data3[i].ssbe0009, this.data3[i].ssbe0010, this.data3[i].ssbe0013, this.data3[i].ssbe0019)
          }
          this.modal = false
        } else {
          const content = '<p>' + res.data.errmsg + '</p>'
          this.$Modal.error({
            title: this.errorTitle,
            content: content
          })
        }
      })
    },
    edit (item1) {
      this.modal = true
      this.paramData = this.receive_arr[item1]
      this.id = item1
      this.getInfo()
    },
    deletePeople (item1) {
      this.data3.splice(item1, 1)
      this.receive_arr.splice(item1, 1)
      this.form_params.ss11007Data = JSON.parse(JSON.stringify(this.receive_arr))
      var param = {
        item_id: this.$route.params.itemid,
        cardno: this.$route.params.cardno,
        form_params: this.form_params,
        code: this.$route.params.code
      }
      console.log(param, '入参')
      if (confirm('确定删除吗？')) {
        updateOrder(param).then(res => {
          if (res.data.errcode === 0) {
            this.$Message.success(res.data.errmsg)
            for (var i = 0; i < this.data3.length; i++) {
              this.data3[i].ssbe0001 = this.dataF1[0].azcp0003
              this.getInfo(i, this.data3[i].ssbe0004, this.data3[i].ssbe0005, this.data3[i].ssbe0006, this.data3[i].ssbe0007, this.data3[i].ssbe0009, this.data3[i].ssbe0010, this.data3[i].ssbe0013, this.data3[i].ssbe0019)
            }
            this.modal = false
          } else {
            const content = '<p>' + res.data.errmsg + '</p>'
            this.$Modal.error({
              title: this.errorTitle,
              content: content
            })
          }
        })
      }
    },
    next () {
      console.log('下一步是工作单位')
      this.$router.push({
        name: 'tk_nearfamily',
        params: this.next_params
      })
    },
    changePage () {
      // The simulated data is changed directly here, and the actual usage scenario should fetch the data from the server
      // this.data3 = this.getHousePropertyList()
    },
    entry () { // 录入
      this.id = ''
      this.paramData = {}
      this.modal = true
      this.getInfo()
    }
  },
  mounted () {
    let param2 = {
      'cardno': this.$route.params.cardno,
      'id': this.$route.params.itemid,
      'code': this.$route.params.code,
      'params': '1'
    }
    // this.getuserinfo(param2.cardno)
    iteminf(param2).then(res => {
      if (res.data.data) {
        if (JSON.parse(res.data.data.form_params).ss11001Data) {
          this.form_params.ss11001Data = JSON.parse(res.data.data.form_params).ss11001Data
        }
        if ((JSON.parse(res.data.data.form_params)).ss11002Data) {
          this.form_params.ss11002Data = JSON.parse(res.data.data.form_params).ss11002Data
          this.dataF1[0] = JSON.parse(res.data.data.form_params).ss11002Data
        }
        if (JSON.parse(res.data.data.form_params).ss11003Data) {
          this.form_params.ss11003Data = JSON.parse(res.data.data.form_params).ss11003Data
        }
        if (JSON.parse(res.data.data.form_params).ss11005Data) {
          this.form_params.ss11005Data = JSON.parse(res.data.data.form_params).ss11005Data
        }
        if (JSON.parse(res.data.data.form_params).ss11006Data) {
          this.form_params.ss11006Data = JSON.parse(res.data.data.form_params).ss11006Data
        }
        if (JSON.parse(res.data.data.form_params).ss11007Data) {
          this.form_params.ss11007Data = JSON.parse(res.data.data.form_params).ss11007Data
          this.receive_arr = JSON.parse(JSON.stringify(this.form_params.ss11007Data))
          this.data3 = JSON.parse(JSON.stringify(this.form_params.ss11007Data))
          for (var i = 0; i < this.data3.length; i++) {
            this.data3[i].ssbe0001 = this.dataF1[0].azcp0003
            this.getInfo(i, this.data3[i].ssbe0004, this.data3[i].ssbe0005, this.data3[i].ssbe0006, this.data3[i].ssbe0007, this.data3[i].ssbe0009, this.data3[i].ssbe0010, this.data3[i].ssbe0013, this.data3[i].ssbe0019)
          }
        }
        if (JSON.parse(res.data.data.form_params).ss11010Data) {
          this.form_params.ss11010Data = JSON.parse(res.data.data.form_params).ss11010Data
        }
        if (JSON.parse(res.data.data.form_params).ss12002Data) {
          this.form_params.ss12002Data = JSON.parse(res.data.data.form_params).ss12002Data
        }
      }
    })
    this.next_params = {
      serialNumber: this.$route.params.serialNumber,
      idcardNumber: this.$route.params.idcardNumber,
      uuid: this.$route.params.uuid,
      code: this.$route.params.code,
      cardno: this.$route.params.cardno,
      // see: this.see,
      itemid: this.itemid
    }
    this.getInfo()
  }
}
</script>
